<!-- 商户授信额 -->
<template>
	<view :class="[data.credit_level == 1 ? 'well__bg' : '',data.credit_level == 2 ? 'good__bg' : '',data.credit_level == 0 ? 'none__bg' : '','container']">
		<image src="/static/images/public/busi_credit.png" mode=""></image>
		<view class="have__credit" v-if="data.credit_level==1 || data.credit_level==2">
			<view class="title">{{data.credit_level == 1 ? '良好' : '优秀'}}</view>
			<view class="number">￥{{data.credit_line}}</view>
			<view class="time">{{data.credit_time}}</view>
		</view>
		<view class="no__credit" v-else>
			<view class="name">当前暂无信用额度</view>
			<view class="tel" @tap="phoneCall">拨打电话了解更多</view>
		</view>
	</view>
</template>

<script>
	import {
		storeCredit
	} from '@/api/merchant.js'
	export default {
		data (){
			return {
				sellerId: null,
				data: {},
				phone: uni.getStorageSync('servicePhone'),
			}
		},
		onLoad(option) {
			this.sellerId = option.id;
			storeCredit({
				seller_id: Number(this.sellerId)
			}).then(res => {
				this.data = res.data;
			})
		},
		methods: {
			phoneCall(){
				uni.makePhoneCall({
					phoneNumber: this.phone
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container{
		height: 100vh;
		text-align: center;
		image{
			margin-top: 4vh;
			opacity: 0.5;
			width: 229rpx;
			height: 200rpx;
		}
		.have__credit{
			.title{
				margin-top: 3vh;
				font-size:48rpx;
				font-weight:bold;
				color:rgba(255,255,255,1);
			}
			.number{
				margin: 3vh 0;
				font-size:80rpx;
				font-weight: bold;
				color:rgba(255,255,255,1);
			}
			.time{
				height:26rpx;
				font-size:28rpx;
				font-weight:400;
				color:rgba(255,255,255,1);
			}
		}
		.no__credit{
			.name{
				margin: 5vh 0;
				font-size:30rpx;
				font-weight:500;
				color:rgba(255,255,255,1);
			}
			.tel{
				width: 301rpx;
				margin: auto;
				border-radius:10rpx;
				border:1px solid rgba(255,255,255,1);
				height:61rpx;
				line-height: 61rpx;
				font-size:24rpx;
				font-weight:400;
				color:rgba(255,255,255,1);
			}
		}
	}
	.well__bg{
		background:linear-gradient(180deg,rgba(52,150,229,1) 0%,rgba(55,152,229,0.29) 71%,rgba(255,255,255,0) 100%);
	}
	.none__bg{
		background:linear-gradient(0deg,rgba(51,51,51,0) 0%,rgba(94,94,94,1) 100%);
	}
	.good__bg{
		background:linear-gradient(180deg,rgba(52,150,229,1) 0%,rgba(55,152,229,0.29) 71%,rgba(255,255,255,0) 100%);
	}
</style>
